@charset "utf-8";

a { text-decoration: none; }
.blind { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px; }
.spr_logos { display: inline-block; background: url(../img/spr_network_logo.png?v=3) no-repeat top left; background-size: 800px 800px; }
.spr_logos.pearlabyss { background-position: 0px 0px; width: 148px; height: 27px; }
.spr_logos.arrow_down { background-position: -161px 0px; width: 12px; height: 7px; }
.spr_logos.arrow_down.active { background-position: -161px -15px; width: 12px; height: 7px; }
.spr_logos.arrow_up { background-position: -181px 0px; width: 12px; height: 7px; }
.spr_logos.arrow_up.active { background-position: -181px -15px; width: 12px; height: 7px; }
.spr_logos.nav_left { background-position: -205px 1px; width: 23px; height: 37px; }
.spr_logos.nav_right { background-position: -237px 1px; width: 23px; height: 37px; }

#top_network { position: relative; display: flex; align-items: center; width: 100%; height: 35px; padding: 0 35px; box-sizing: border-box; background: #222229; line-height: 24px; overflow: hidden; z-index: 100; }
#top_network.active { height: 35px; overflow: visible; }
#top_network .logo_wrap,
#top_network .menu_list { float: left; display: inline-block; }
#top_network .logo_wrap .pearlabyss { display: block; width: 123px; height: 16px; opacity: 0.7; -webkit-transition: opacity 0.25s; transition: opacity 0.25s; background: url("../img/img_network_bi.svg") no-repeat center / contain; }

#top_network .menu_list { margin: 0 0 0 24px; padding: 0; }
#top_network .menu_list li { position: relative; float: left; display: inline-block; height: 27px; line-height: 27px; }
#top_network .menu_list li[data-top_network^="btn_games"] a { padding-right: 36px; }
#top_network .menu_list li[data-top_network^="btn_games"]:after { position: absolute; top: 10px; right: 18px; width: 0; height: 0; border: 5px solid transparent; border-top-width: 6px; border-top-color: #777786; pointer-events: none; content: ""; -webkit-transition: border-color 0.2s, transform 0.2s; transition: border-color 0.2s, transform 0.2s; }
#top_network .menu_list li[data-top_network^="btn_games"]:hover:after { border-top-color: #fff; }
#top_network .menu_list li[data-top_network^="btn_games"].active:after { border-top-color: #fff; -webkit-transform: translateY(-50%) scaleY(-1); transform: translateY(-50%) scaleY(-1); }
#top_network .menu_list li a { padding: 0 30px; color: #777786; text-decoration: none; font-weight: normal; font-size: 13px; display: inline-block; -webkit-transition: color 0.2s; transition: color 0.2s; }
#top_network .menu_list li.active a,
#top_network .menu_list li:hover a { color: #fff; }

#top_network .link_bar_pc { position: absolute; top: 35px; left: 0; width: 100%; height: 580px; background: #19191e; display: none; }
#top_network .nav_wrap_pc { max-width: 1630px; margin: 0 auto; display: flex; }
#top_network .nav_wrap_pc .nav_btn.left,
#top_network .nav_wrap_pc .nav_btn.right { display: inline-flex; justify-content: center; align-items: center; flex: 0 0 100px; height: 100px; }
#top_network .nav_wrap_pc .nav_btn .nav_left,
#top_network .nav_wrap_pc .nav_btn .nav_right { width: 23px; height: 23px; opacity: 0.5; border-left: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; }
#top_network .nav_wrap_pc .nav_btn .nav_left { -webkit-transform: rotate(45deg); }
#top_network .nav_wrap_pc .nav_btn .nav_right { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); }
#top_network .slider_brand { flex: 1 1 auto; max-width: calc(100% - 200px); }
#top_network .slider_brand .platform { display: inline-flex; justify-content: center; align-items: center; height: 99px; padding: 4px 10px 0 10px; border: none; border-bottom: solid 4px transparent; box-sizing: border-box; padding: 0; -webkit-transition: color 0.2s, border 0.2s; transition: color 0.2s, border 0.2s; width: 288px; color: #5b5b69; font-size: 18px; background: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
#top_network .slider_brand .platform:focus { outline: none; }
#top_network .banner_pc { position: absolute; top: 0; right: 26px; display: inline-flex; align-items: center; height: 50px; transition: filter 0.3s; }
#top_network .banner_pc:hover { -webkit-filter: brightness(1.3); filter: brightness(1.3); }

#top_network .slider_brand[data-current="bdo"] .platform[data-hover="bdo"],
#top_network .slider_brand[data-current="bdm"] .platform[data-hover="bdm"],
#top_network .slider_brand[data-current="bdc"] .platform[data-hover="bdc"],
#top_network .slider_brand[data-current="dokev"] .platform[data-hover="dokev"],
#top_network .slider_brand[data-current="plan8"] .platform[data-hover="plan8"],
#top_network
.slider_brand[data-current="crimson_desert"]
.platform[data-hover="crimson_desert"],
#top_network .slider_brand .platform:hover { border-bottom-color: #ae8954; font-weight: normal; color: #fff; }

/* Plan8 */
.pla #top_network { position: absolute; width: 100%; }

/* dok */
.dok #top_network { position: absolute; width: 100%; }
.dok .swiper-container { height: 100%; }

/* spr logo */
.spr_logo2 { display: inline-block; background: url(../img/spr_network_logo.png?v=3) top left no-repeat; }
.spr_logo2.bdo { width: 217px; height: 32px; margin-bottom: 7px; background-position: -371px -274px; }
.spr_logo2.bdo.kr { width: 115px; height: 32px; background-position: -10px -325px; margin-bottom: 10px; }
.spr_logo2.bdo.jp { width: 118px; height: 32px; background-position: -267px -367px; margin-bottom: 10px; }
.spr_logo2.bdo.tw { width: 125px; height: 32px; background-position: -265px -406px; margin-bottom: 10px; }
.spr_logo2.bdm { width: 152px; height: 41px; background-position: -10px -224px; margin-bottom: 10px; }
.spr_logo2.bdm.jp { width: 224px; height: 32px; background-position: -10px -367px; }
.spr_logo2.bdm.cn,
.spr_logo2.bdm.tw { width: 225px; height: 29px; background-position: -8px -408px; }
.spr_logo2.bdm.kr { width: 214px; height: 28px; background-position: -135px -325px; }
.spr_logo2.dokev { width: 129px; height: 43px; background-position: -131px -170px; margin-bottom: 10px; }
.spr_logo2.dokev.kr { width: 107px; height: 40px; background-position: -172px -224px; }
.spr_logo2.plan8 { width: 100px; height: 51px; background-position: -113px -104px; margin-bottom: 18px; }
.spr_logo2.btn_network_open_mo { width: 42px; height: 42px; background-position: -282px -10px; }
.spr_logo2.btn_network_open_white_mo { width: 42px; height: 42px; background-position: -270px -170px; }
.spr_logo2.arrow_next { width: 22px; height: 37px; background-position: -334px -10px; }
.spr_logo2.arrow_prev { width: 22px; height: 37px; background-position: -335px -104px; }
.spr_logo2.pearlabyss { width: 148px; height: 27px; background-position: -10px -446px; opacity: 0.7; transition: opacity 0.3s; -webkit-transform: scale(0.9); transform: scale(0.9); }
.spr_logo2.cd { width: 348px; height: 46px; background-position: -10px -483px; margin-bottom: 14px; }
.spr_logo2.arrow_up_white { width: 11px; height: 7px; background-position: -343px -170px; }
.spr_logo2.arrow_up_gray { width: 11px; height: 7px; background-position: -325px -275px; }
.spr_logo2.arrow_down_gray { width: 11px; height: 7px; background-position: -346px -275px; }
.spr_logo2.arrow_down_white { width: 11px; height: 7px; background-position: -244px -367px; }

.link_contents_pc { height: 480px; background: #23232a; }
.link_contents_pc .platform { max-width: 2000px; margin: 0 auto; height: 480px; padding: 40px 0 0 30px; box-sizing: border-box; display: none; }
.link_contents_pc .platform.active { display: block; }
.link_contents_pc .platform > .inner { display: block; max-width: 1600px; width: 100%; margin: 0 auto; }
.link_contents_pc .platform .contents_wrap { position: relative; max-width: 616px; height: 440px; padding: 0; }
.link_contents_pc .platform.bdo { background: url(../img/bg_network_bdo.jpg) top center no-repeat; }
.link_contents_pc .platform.bdm { background: url(../img/bg_network_bdm.jpg) top center no-repeat; }
.link_contents_pc .platform.plan8 { background: url(../img/bg_network_plan8.jpg) top center no-repeat; }
.link_contents_pc .platform.dokev { background: url(../img/bg_network_dokev.jpg) top center no-repeat; }
.link_contents_pc .platform.crimson_desert { background: url(../img/bg_network_cd_v4.jpg) top center no-repeat; }

.link_contents_pc .logo { display: flex; justify-content: flex-start; align-items: center; height: 70px; }
.link_contents_pc .category { color: #8484a3; font-size: 15px; line-height: 20px; margin: 0 0 14px 0; opacity: 0.5; }
.link_contents_pc .set_wrap { min-height: 204px; }
.link_contents_pc .name { font-size: 34px; line-height: 1.4; color: #fff; margin: 0; letter-spacing: -0.1rem; }
.link_contents_pc .desc { font-size: 15px; line-height: 24px; color: #d8d8ec; margin: 6px 0 12px 0; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; opacity: 0.6; }
[data-network-lang="ko-kr"] .link_contents_pc .name,
[data-network-lang="zh-cn"] .link_contents_pc .name,
[data-network-lang="zh-tw"] .link_contents_pc .name,
[data-network-lang="ja-jp"] .link_contents_pc .name { font-size: 40px; }
[data-network-lang="ko-kr"] .link_contents_pc .desc,
[data-network-lang="ja-jp"] .link_contents_pc .desc,
[data-network-lang="zh-cn"] .link_contents_pc .desc,
[data-network-lang="zh-tw"] .link_contents_pc .desc { font-size: 15px; margin: 16px 0 22px 0; }

.link_contents_pc .btn_wrap { position: absolute; bottom: 50px; left: 0; display: block; margin-top: 10px; overflow: hidden; width: 100%; }
.link_contents_pc .btn_wrap a.link { float: left; display: inline-flex; justify-content: center; align-items: center; width: 49%; height: 54px; border-radius: 26px; border: solid 1px rgba(131, 131, 145, 0.4); color: #d0d4db; font-size: 15px; line-height: 20px; padding: 0 16px; text-align: center; box-sizing: border-box; word-break: keep-all; margin-bottom: 14px; }
.link_contents_pc .btn_wrap .sns_set { float: left; display: inline-block; }
.link_contents_pc .btn_wrap a + .sns_set:nth-child(2) { margin-left: 10px; }
.link_contents_pc .btn_wrap a + a { margin-left: 10px; }
.link_contents_pc .btn_wrap a.link + .link { margin-left: 2%; }
.link_contents_pc .btn_wrap a.link:hover { color: #fff; background: #9a7d53; }
.link_contents_pc .btn_wrap a.sns { float: left; display: inline-flex; justify-content: center; align-items: center; width: 54px; height: 54px; border: solid 1px rgba(131, 131, 145, 0.4); border-radius: 27px; box-sizing: border-box; }

.link_contents_pc .btn_wrap .sns.fb .spr_logo2 { width: 11px; height: 22px; background-position: -322px -170px; }
.link_contents_pc .btn_wrap .sns.insta .spr_logo2 { width: 22px; height: 21px; background-position: -289px -224px; }
.link_contents_pc .btn_wrap .sns.youtube .spr_logo2 { width: 25px; height: 18px; background-position: -321px -224px; }
.link_contents_pc .btn_wrap .sns.vk .spr_logo2 { width: 25px; height: 16px; background-position: -428px -225px; }
.link_contents_pc .btn_wrap .sns.twitch .spr_logo2 { width: 25px; height: 24px; background-position: -392px -224px; }
.link_contents_pc .btn_wrap .sns.twitter .spr_logo2 { width: 22px; height: 22px; background-image: url("../img/icn_x_white.svg"); background-position: center; background-size: cover; }
.link_contents_pc .btn_wrap .sns.yahoo .spr_logo2 { width: 24px; height: 24px; background-position: -369px -169px; }
.link_contents_pc .btn_wrap .sns.line .spr_logo2 { width: 25px; height: 24px; background-position: -404px -169px; }
.link_contents_pc .btn_wrap .sns.discord .spr_logo2 { width: 30px; height: 24px; background-position: -465px -223px; }
.link_contents_pc .btn_wrap .sns.fb:hover { background: #3b68b3; border-color: #3b68b3; }
.link_contents_pc .btn_wrap .sns.youtube:hover { background: #c94040; border-color: #c94040; }
.link_contents_pc .btn_wrap .sns.insta:hover { background: #d3326b; border-color: #d3326b; }
.link_contents_pc .btn_wrap .sns.vk:hover { background: #387edd; border-color: #387edd; }
.link_contents_pc .btn_wrap .sns.twitch:hover { background: #9440c9; border-color: #9440c9; }
.link_contents_pc .btn_wrap .sns.twitter:hover { background: #000; border-color: #000; }
.link_contents_pc .btn_wrap .sns.yahoo:hover { background: #7c2add; border-color: #7c2add; }
.link_contents_pc .btn_wrap .sns.line:hover { background: #0da70d; border-color: #0da70d; }
.link_contents_pc .btn_wrap .sns.discord:hover { background: #4441cc; border-color: #4441cc; }

.global_network_m { display: none; }
.global_network_m .top_network_mo { border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; }
.global_network_m .top_network_mo .network_node_parent { display: flex; align-items: center; width: 100%; height: auto; padding: 20px 38px; font-size: 16px; line-height: 1; color: #3d3d3d; }
.global_network_m .top_network_mo .network_node_parent:after { display: none; }
.global_network_m .top_network_mo li:last-of-type .network_node_parent { border-bottom: none; }
.global_network_m .top_network_mo li .network_submenu { width: 100%; position: static; height: auto; padding: 20px 0; background-color: #fff; border-bottom: 1px solid #dfdfdf; box-sizing: border-box; z-index: 9999; }
.global_network_m .top_network_mo li .network_submenu li { display: flex; align-items: center; box-sizing: border-box; }
.global_network_m .top_network_mo li .network_submenu li.network_node_child a { display: flex; align-items: center; padding: 18px 0 18px 56px; width: 100%; color: #2b2b2b; font-size: 16px; }
/* .global_network_m .top_network_mo li .network_submenu li span.new { display: flex; flex-shrink: 0; justify-content: center; width: 50px; height: 23.3328px; margin-left: 6.656px; border: 2px solid #ff6666; border-radius: 12.8px; color: #da0011; font-weight: normal; line-height: 1.4; font-size: 14.6672px; } */
.global_network_m .top_network_mo li .network_node_parent { border-bottom: 1px solid #dfdfdf; }
.global_network_m .top_network_mo li .network_node_parent .pi { display: none; }
.global_network_m .top_network_mo li .network_node_parent:after { display: none; }
.global_network_m .top_network_mo li button.network_node_parent:after { content: ""; display: block; margin-left: 5px; border-top: 5px solid #808080; border-left: 5px solid transparent; border-right: 5px solid transparent; -webkit-transition: transform 0.3s; transition: transform 0.3s; }
.global_network_m .top_network_mo li button.network_node_parent.active:after { -webkit-transform: rotateX(180deg); transform: rotateX(180deg); }

@media screen and (min-width: 1025px) {
    #top_network .logo_wrap .pearlabyss:hover { opacity: 1; }
    #top_network .nav_wrap_pc .nav_btn:hover i { opacity: 1; }
    .spr_logo2.pearlabyss:hover { opacity: 1; }
}

@media screen and (max-width: 1280px) {
    .bdm .global_network_m { display: block; }
    .bdm #top_network { display: none; }
    .header_mobile { z-index: 9999; }
}

@media screen and (max-width: 1024px) {
    [data-top_network="btn_games_pc"] { display: none !important; }

    /* focus active */
    .spr_logo2.pearlabyss:active { opacity: 1; }

    /* 모바일 삭제 */
    .btnApp.network { display: none !important; }
    .btn_network_mo,
    #top_network .banner_pc { display: none !important; }

    #top_network { display: none; }
    #top_network .link_bar_pc,
    .banner_zone { display: none !important; }

    #top_network { padding: 12px 0 13px 3%; }
    #top_network .menu_list { margin: 0; display: flex; justify-content: start; }
    #top_network .menu_list li a { padding: 0 22px 0 0; font-size: 13px; }
    #top_network .menu_list li:nth-of-type(2) ~ li a { padding-right: 0; padding-left: 20px; }
    #top_network .menu_list li[data-top_network^="btn_games"]:after { right: 6px; top: 11.5px; }
    #top_network .menu_list li[data-top_network^="btn_games"].active:after { top: 10px; }
    #top_network .logo_wrap a { width: 148px; height: 27px; zoom: 0.8; margin-right: 24px; margin-left: 4px; margin-top: 4px; }

    /* top_network_mo */
    .global_network_m { display: block; }

    /* GST */
    .gst nav.nav_mo.active { z-index: 9999999999999; }
}

@media screen and (max-width: 480px) {
    #top_network .logo_wrap a { margin-right: 10px; }
    #top_network .menu_list li a { font-size: 12px; }
}

/* cookiebot Style */
.cookie_popup_wrap { z-index: 10001 !important; }
.cookie_popup_wrap.zIndex_down { z-index: 9999 !important; }

#CybotCookiebotDialog { top: auto !important; bottom: 0 !important; width: 101% !important; max-width: 101% !important; border-radius: 0 !important; transform: translate(-50%, 0) !important; z-index: 10000 !important; }
#CybotCookiebotDialog .CybotCookiebotDialogContentWrapper { max-width: 1200px !important; margin: 0 auto; }

#CybotCookiebotDialog
.CybotCookiebotDialogBodyButton:not(.CybotCookiebotDialogHide) { display: flex; justify-content: center; align-items: center; }

#CybotCookiebotDialogFooter .CybotCookiebotDialogArrow { flex: 0 0 auto !important; }
#CybotCookiebotDialog .CybotCookiebotScrollArea::-webkit-scrollbar-thumb { background: #555 !important; }
#CybotCookiebotDialog .CybotCookiebotScrollArea::-webkit-scrollbar-track { background: #292929 !important; }

/* cookiebot BI remove */
a#CybotCookiebotDialogPoweredbyCybot { display: none !important; }
#CybotCookiebotDialogHeader { border-bottom: none !important; padding: 0.5em 0 0 !important; display: none !important; }

/* cookie banner Style */
.cookieAlert { position: fixed; left: 0; right: 0; bottom: 0; font-size: 16px; overflow: hidden; width: 100%; background-color: #171717; transition: transform 0.7s ease-in-out; transform: translate(0, 100%); z-index: 100; }
.cookieAlert .alertInner { position: relative; display: flex; justify-content: flex-start; align-items: center; margin: 0 auto; max-width: 1200px; padding: 15px 30px; box-sizing: border-box; overflow: hidden; }
.cookieAlert.active { transform: translate(0, 0); }
.cookieAlert .message { flex: 1 1 auto; box-sizing: border-box; margin-right: 24px; }
.cookieAlert .message span { display: block; line-height: 1.4; color: #fff; }
.cookieAlert .message a { display: flex; align-items: center; color: #db810d; text-decoration: none; margin-top: 10px; }
.cookieAlert .message a::after { border-style: solid; border-width: 0.15em 0.15em 0 0; border-color: #e4e4e4; content: ""; display: block; width: 0.563em; height: 0.563em; margin-left: 1em; transform: rotate(45deg); }
.cookieAlert .message a:hover::after { border-color: #db810d; }
.cookieAlert .cookieAllow { display: flex; justify-content: center; align-items: center; padding: 0.8em 2em; font-size: 15px; line-height: 20px; color: #cfcfcf; font-weight: 600; text-align: center; vertical-align: top; border-radius: 0.25em; background-color: #292929; border: 2px solid #292929; cursor: pointer; flex: 0 0 auto; }
.cookieAlert .cookieAllow:hover { opacity: 0.85; }

@media (min-width: 1280px) {
    /* cookiebot Style */
    #CybotCookiebotDialog.CybotEdge .CybotCookiebotDialogContentWrapper { max-width: 1200px; }
}

@media (max-width: 1279px) {
    /* cookiebot Style */
    #CybotCookiebotDialog { padding: 1% 15% 0; }
    #CybotCookiebotDialog *,
    #CybotCookiebotDialogBodyUnderlay * { font-size: 13px !important; }
    #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton { padding: 0.8em !important; }
    #CybotCookiebotDialogPoweredByText { display: none !important; }
    #CybotCookiebotDialogBodyButtons { display: flex; justify-items: center; align-items: center; }
}

@media (max-width: 768px) {
    /* cookiebot Style */
    #CybotCookiebotDialog { padding: 1% 2% 2% 3%; }

    /* cookie banner Style */
    .cookieAlert { font-size: 14px; }
    .cookieAlert .alertInner { padding: 10px; flex-direction: column; align-items: flex-start; }
    .cookieAlert .message { padding: 10px 0; margin-right: 0; }
    .cookieAlert .cookieAllow { flex: 1 0 auto; width: 100%; margin-top: 0.8em; font-size: 13px; }
}

@media (max-width: 600px) {
    /* cookiebot Style */
    #CybotCookiebotDialog { padding: 1% 1% 0; }
}